<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>演示vue3的插值语法</title>
    <!--1.引入外部的vue的js文件-->
    <script src="./js/vue@3.5.12.global.js"></script>
</head>
<body>
    <!--2.创建视图-->
    <div id="app">
        <h3>{{message}}</h3>
        <h3>{{age}}</h3>
        <h3>{{age+10}}</h3>
        <h3>{{'欢迎大家来学习：'+message}}</h3>
        <h3>{{flag}}</h3>
        <h3>{{name}}</h3>
    </div>
</body>
<!--创建js-->
<script>
    //3.创建vue的实例 const:常量
    const app = Vue.createApp({
        //数据模型
        data(){
            return{
                message: 'hello vue3',
                age: 18,
                flag: true,//布尔值
                name: '李四'
            }
        }
    });
    //4.挂载:让数据在指定的位置渲染
    app.mount('#app')
</script>
</html>